<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>主页</title>
    <link rel="stylesheet" th:href="@{/semantic/semantic.min.css}">
    <link rel="stylesheet" th:href="@{/layui/css/layui.css}">
    <style>

    </style>
</head>

<body>

<!--        导航栏-->
<ul class="layui-nav" th:fragment="header(active)">
    <li th:class="${active == '主页' ? 'layui-nav-item layui-this' : 'layui-nav-item'}">
        <a th:href="@{/}">主页</a>
    </li>

    <li th:class="${active == '用户信息' ? 'layui-nav-item layui-this' : 'layui-nav-item'}">
        <a th:if="${session.user == null}" th:href="@{/user/info/{id}(id=${#request.getAttribute('user').id})}">用户信息</a>
        <a th:if="${session.user != null}" th:href="@{/user/info/{id}(id=${session.user.id})}">用户信息</a>
    </li>

    <li th:if="${session.user != null && #request.getAttribute('user') != null && #request.getAttribute('user').id == session.user.id}"
        th:class="${active == '发布文章' ? 'layui-nav-item layui-this' : 'layui-nav-item'}">
        <a th:href="@{/user/create}">发布文章</a>
    </li>

    <li th:class="${active == '历史文章' ? 'layui-nav-item layui-this' : 'layui-nav-item'}">
        <a th:href="@{/topic/history/{id}(id=${#request.getAttribute('user').id})}">历史文章</a>
    </li>

    <li th:class="${active == '历史评论' ? 'layui-nav-item layui-this' : 'layui-nav-item'}">
        <a th:href="@{/comment/history/{id}(id=${#request.getAttribute('user').id})}">历史评论</a>
    </li>

    <li th:if="${session.user != null && #request.getAttribute('user') != null && #request.getAttribute('user').id == session.user.id}"
        th:class="${active == '修改密码' ? 'layui-nav-item layui-this' : 'layui-nav-item'}">
        <a th:href="@{/user/update}">修改密码</a>
    </li>

    <li th:class="${active == '用户' ? 'layui-nav-item layui-this' : 'layui-nav-item'}" style="float: right">
        <a th:if="${session.user == null}" th:href="@{/login}">
            <i class="layui-icon layui-icon-username" style="font-size: 25px;"></i>
        </a>
        <div th:insert="component/avator.html::avator"></div>
    </li>
</ul>

</body>

<script th:src="@{/js/jquery.min.js}" crossorigin="anonymous"></script>
<script th:src="@{/semantic/semantic.min.js}"></script>
<script th:src="@{/layui/layui.js}"></script>
<script th:src="@{/js/vue.js}"></script>
<script th:src="@{/js/axios.js}"></script>

</html>